<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title><TMPL_VAR NAME="TITLE"></title>
<TMPL_IF NAME="CUSTOMCSS"><style type="text/css">
<TMPL_VAR NAME="CUSTOMCSS">
</style></TMPL_IF>
<TMPL_IF NAME="CUSTOMJS"><script type="text/javascript">
<TMPL_VAR NAME="CUSTOMJS">
</script></TMPL_IF>
<link rel="stylesheet" href="album_designs/sky_blue/style.css" type="text/css" media="screen" />
</head>

<body>

<script language="javascript">

function nudge1(img) {
  img.style.left = '1px';
  img.style.top = '1px';
}

function nudge2(img) {
  img.style.left = 0;
  img.style.top = 0;
}

function enlarge_view() {
  v = document.getElementById("view");
  t = document.getElementById("thumbs");
  t.style.display = "none";
  v.style.width = "100%";
}

function shrink_view() {
  v = document.getElementById("view");
  t = document.getElementById("thumbs");
  t.style.display = null;
  v.style.width = null;
  
}

function handle_navigation( html, thispage, maxpage ){
  
  gofirst = document.getElementById("gofirst");
  gonext = document.getElementById("gonext");
  goprev = document.getElementById("goprev");
  golast = document.getElementById("golast");
  
  thispage = parseInt(thispage);
  maxpage = parseInt(maxpage);
  
  if( thispage <= 1 && maxpage <= 1 ){
    gofirst.style.visibility="hidden";
    goprev.style.visibility="hidden";
    gonext.style.visibility="hidden";
    golast.style.visibility="hidden";
  }
  else if(maxpage > 1 && thispage == 1){
    gofirst.style.visibility="hidden";
    goprev.style.visibility="hidden";
    gonext.style.visibility="visible";
    golast.style.visibility="visible";
  }
  else if(maxpage > 1 && thispage < maxpage){
    gonext.style.visibility="visible";
    golast.style.visibility="visible";
    goprev.style.visibility="visible";
    gofirst.style.visibility="visible";
  }
  else if( thispage >= maxpage ){
    goprev.style.visibility="visible";
    gofirst.style.visibility="visible";
    gonext.style.visibility="hidden";
    golast.style.visibility="hidden";
  }
  
  
  document.getElementById("thumbs_here").innerHTML = html;
  document.getElementById("thispage").innerHTML = thispage;
  document.getElementById("maxpage").innerHTML = maxpage;
  
}

</script>

<form>
<div id="wrapper">

	<div id="thumbs"><form>
	<input type="hidden" id="startoffset" value="0">
	<div id="thumbs_here"><TMPL_VAR NAME="THUMBS"></div>
	
	<table id="navpanel"><tr>
	
	<td>
	<img onmousedown="nudge1(this);return true;" onmouseup="nudge2(this);return true;"
	onclick = "jsViewThumbs(['startoffset','album_id'],[handle_navigation])"
	 class="left" src="album_designs/sky_blue/images/stock-goto-first.png" id="gofirst">

	<img onmousedown="nudge1(this);return true;" onmouseup="nudge2(this);return true;"
	onclick = "jsViewThumbs(['offset_prev','album_id'],[handle_navigation])"
	 class="left" src="album_designs/sky_blue/images/stock-go-back.png" id="goprev">

	 </td><td>
	 
	<span id="navigation">Side <span id="thispage">1</span>/<span id="maxpage">nn</span></span>
	 
	 </td><td>
	 	 
	<img onmousedown="nudge1(this);return true;" onmouseup="nudge2(this);return true;"
	onclick = "jsViewThumbs(['offset_next','album_id'],[handle_navigation])"
	 class="right" src="album_designs/sky_blue/images/stock-go-forward.png" id="gonext">

	<img onmousedown="nudge1(this);return true;" onmouseup="nudge2(this);return true;"
	onclick = "jsViewThumbs(['lastoffset','album_id'],[handle_navigation])"
	 class="right" src="album_designs/sky_blue/images/stock-goto-last.png" id="golast">
	 
	 </td></tr>
	 </table>
	 
	</div>
	
	<div id="view">
	</div>
	
	
</div>
</form>

</body>
</html>
